﻿<phone:PhoneApplicationPage 
    x:Class="OneShoppingList.View.EditPage"
    xmlns:local="clr-namespace:OneShoppingList.View"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="696"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    DataContext="{Binding Main,Source={StaticResource Locator}}"
    shell:SystemTray.IsVisible="True">

    <toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardIn"/>
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardIn"/>
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>
    <toolkit:TransitionService.NavigationOutTransition>
        <toolkit:NavigationOutTransition>
            <toolkit:NavigationOutTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardOut"/>
            </toolkit:NavigationOutTransition.Backward>
            <toolkit:NavigationOutTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardOut"/>
            </toolkit:NavigationOutTransition.Forward>
        </toolkit:NavigationOutTransition>
    </toolkit:TransitionService.NavigationOutTransition>

    <!--<toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:SlideTransition Mode="SlideDownFadeIn"/>
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:SlideTransition Mode="SlideLeftFadeIn"/>
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>
    <toolkit:TransitionService.NavigationOutTransition>
        <toolkit:NavigationOutTransition>
            <toolkit:NavigationOutTransition.Backward>
                <toolkit:SlideTransition Mode="SlideRightFadeOut"/>
            </toolkit:NavigationOutTransition.Backward>
            <toolkit:NavigationOutTransition.Forward>
                <toolkit:SlideTransition Mode="SlideUpFadeOut"/>
            </toolkit:NavigationOutTransition.Forward>
        </toolkit:NavigationOutTransition>
    </toolkit:TransitionService.NavigationOutTransition>-->

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <!--Pivot Control-->
        <controls:Pivot 
            Title="ONE SHOPPING LIST"
            Margin="0,0,0,0">

            <!--Favorite Products-->
            <controls:PivotItem 
                Header="Favorites"
                Margin="12,12,0,0">
                <Grid>
                    <toolkit:LongListSelector Name="favoritesSelector"
                                  toolkit:TiltEffect.IsTiltEnabled="True"
                                  Grid.Row="1"
                                  Margin="0,0,0,0"
                                  Background="Transparent"
                                  ItemsSource="{Binding FavoritesViewModel.GroupsView}"
                                  ScrollingStarted="longListSelector_ScrollingStarted"
                                  >

                        <toolkit:LongListSelector.GroupItemsPanel>
                            <ItemsPanelTemplate>
                                <StackPanel Orientation="Vertical"
                        Width="456"
                        Margin="12"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Center"
                        toolkit:TiltEffect.IsTiltEnabled="True"/>
                            </ItemsPanelTemplate>
                        </toolkit:LongListSelector.GroupItemsPanel>

                        <toolkit:LongListSelector.GroupItemTemplate>
                            <DataTemplate>
                                <Button Content="{Binding Key}" 
                            IsHitTestVisible="{Binding HasItems}"
                            Background="{Binding HasItems,Converter={StaticResource boolToActiveBrushConverter}}"
                            Style="{StaticResource TiltButtonStyle}"
                            Margin="12,6,0,6"
                            FontSize="42"
                            HorizontalContentAlignment="Center"
                            Foreground="{StaticResource PhoneForegroundBrush}"
                            />
                            </DataTemplate>
                        </toolkit:LongListSelector.GroupItemTemplate>

                        <toolkit:LongListSelector.GroupFooterTemplate>
                            <DataTemplate>
                                <Grid Height="24"/>
                            </DataTemplate>
                        </toolkit:LongListSelector.GroupFooterTemplate>

                        <toolkit:LongListSelector.GroupHeaderTemplate>
                            <DataTemplate>
                                <Grid 
                                    HorizontalAlignment="Stretch"
                                    Background="{StaticResource PhoneAccentBrush}"
                                    Margin="0,0,0,0"
                                    >

                                    <TextBlock 
                                        Text="{Binding Key}" 
                                        VerticalAlignment="Center"
                                        Margin="12,6,0,6"
                                        Style="{StaticResource PhoneTextLargeStyle}"
                                        />

                                </Grid>
                            </DataTemplate>
                        </toolkit:LongListSelector.GroupHeaderTemplate>

                        <toolkit:LongListSelector.ItemTemplate>
                            <DataTemplate>
                                <Button
                                    toolkit:TiltEffect.IsTiltEnabled="True"
                                    Style="{StaticResource TiltButtonStyle}" 
                                    Click="Button_Click">

                                    <toolkit:ContextMenuService.ContextMenu>
                                        <toolkit:ContextMenu 
                                            Margin="12,0,0,0"
                                            Width="468"
                                            x:Name="contextMenu" 
                                            IsFadeEnabled="False"
                                            IsZoomEnabled="False"
                            
                                            Padding="0" Opened="menu_Opened">
                                            <!-- You can suppress tilt on indivudal menu items with TiltEffect.SuppressTilt="True" -->
                                            <toolkit:MenuItem 
                                                toolkit:TiltEffect.SuppressTilt="True"
                                                Padding="0"
                                                Width="456"
                                                Header="{Binding}"
                                                Margin="0"
                                                >
                                                <toolkit:MenuItem.HeaderTemplate>
                                                    <DataTemplate>
                                                        <Grid Margin="0,0,0,0">
                                                            <Grid.RowDefinitions>
                                                                <RowDefinition Height="Auto"/>
                                                                <RowDefinition Height="Auto"/>
                                                            </Grid.RowDefinitions>
                                                            <Grid.ColumnDefinitions>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="*"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="*"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                            </Grid.ColumnDefinitions>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="0"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                Margin="-12,0,0,0"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.DeleteProductItemCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Click="CloseContextMenu"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource deleteBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                HorizontalAlignment="Center"
                                                                Text="delete" 
                                                                Margin="-12,-12,0,0"
                                                                Grid.Row="1" Grid.Column="0"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="3"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Click="EditButon_Click"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource editBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="edit" 
                                                                Margin="0,-12,0,0"
                                                                HorizontalAlignment="Center"
                                                                Grid.Row="1" Grid.Column="3"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="4"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.RemoveFavoriteCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Click="CloseContextMenu"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource removeFavBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="no fav." 
                                                                Margin="0,-12,0,0"
                                                                HorizontalAlignment="Center"
                                                                Grid.Row="1" Grid.Column="4"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="8"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.DecreaseQuantityCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource minusBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="less" 
                                                                HorizontalAlignment="Center"
                                                                Margin="0,-12,0,0"
                                                                Grid.Row="1" Grid.Column="8"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button Grid.Row="0" Grid.Column="9"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.IncreaseQuantityCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource addBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="more" 
                                                                Margin="0,-12,0,0"
                                                                HorizontalAlignment="Center"
                                                                Grid.Row="1" Grid.Column="9"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                        </Grid>
                                                    </DataTemplate>
                                                </toolkit:MenuItem.HeaderTemplate>
                                            </toolkit:MenuItem>
                                        </toolkit:ContextMenu>
                                    </toolkit:ContextMenuService.ContextMenu>
                                    <Grid 
                                        HorizontalAlignment="Stretch"
                                        Height="75"
                                        >

                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto"/>
                                            <ColumnDefinition Width="*"/>
                                            <ColumnDefinition Width="60"/>
                                            <ColumnDefinition Width="70"/>
                                        </Grid.ColumnDefinitions>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="3"/>
                                            <RowDefinition Height="Auto"/>
                                            <RowDefinition Height="30"/>
                                            <RowDefinition Height="3"/>
                                        </Grid.RowDefinitions>

                                        <Border 
                                            Margin="0,0,0,0"
                                            BorderBrush="{StaticResource PhoneChromeBrush}"
                                            BorderThickness="3"
                                            Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="4"
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Top"/>

                                        <CheckBox 
                                            IsChecked="{Binding IsOnShoppingList,Mode=TwoWay}"
                                            Grid.Row="1" Grid.Column="3" Grid.RowSpan="2"
                                            Margin="12,0,0,0"
                                            VerticalAlignment="Center"
                                            />

                                        <TextBlock 
                                            VerticalAlignment="Top"
                                            Text="{Binding Caption}"
                                            TextWrapping="NoWrap"
                                            Margin="12,0,0,0"
                                            Grid.Row="1" Grid.Column="0"
                                            Style="{StaticResource PhoneTextLargeStyle}"/>

                                        <TextBlock 
                                            VerticalAlignment="Top"
                                            Text="{Binding PreferredShop}"
                                            Margin="12,0,0,0"
                                            Grid.Row="2" Grid.Column="0"
                                            TextWrapping="NoWrap"
                                            Style="{StaticResource PhoneTextSubtleStyle}"/>

                                        <TextBlock
                                            Grid.Row="1" Grid.Column="2"
                                            Text="{Binding Quantity}"
                                            VerticalAlignment="Top"
                                            HorizontalAlignment="Left"
                                            TextWrapping="NoWrap"
                                            Margin="0"
                                            Style="{StaticResource PhoneTextLargeStyle}"
                                            />

                                        <TextBlock
                                            Grid.Row="2" Grid.Column="2"
                                            Text="{Binding UnitSize}"
                                            TextWrapping="NoWrap"
                                            VerticalAlignment="Top"
                                            Margin="0"
                                            Style="{StaticResource PhoneTextSubtleStyle}"
                                            />
                                    </Grid>
                                </Button>
                            </DataTemplate>
                        </toolkit:LongListSelector.ItemTemplate>
                    </toolkit:LongListSelector>
                </Grid>
            </controls:PivotItem>
            
            <!--All Products -->
            <controls:PivotItem 
                Header="All"
                Margin="12,12,0,0">
                <Grid>
                    <toolkit:LongListSelector Name="longListSelector"
                                  toolkit:TiltEffect.IsTiltEnabled="True"
                                  Grid.Row="1"
                                  Margin="0,0,0,0"
                                  Background="Transparent"
                                  ItemsSource="{Binding AllProductsViewModel.GroupsView}"
                                  ScrollingStarted="longListSelector_ScrollingStarted"
                                  >

                        <toolkit:LongListSelector.GroupItemsPanel>
                            <ItemsPanelTemplate>
                                <StackPanel Orientation="Vertical"
                        Width="456"
                        Margin="12"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Center"
                        toolkit:TiltEffect.IsTiltEnabled="True"/>
                            </ItemsPanelTemplate>
                        </toolkit:LongListSelector.GroupItemsPanel>

                        <toolkit:LongListSelector.GroupItemTemplate>
                            <DataTemplate>
                                <Button Content="{Binding Key}" 
                            IsHitTestVisible="{Binding HasItems}"
                            Background="{Binding HasItems,Converter={StaticResource boolToActiveBrushConverter}}"
                            Style="{StaticResource TiltButtonStyle}"
                            Margin="12,6,0,6"
                            FontSize="42"
                            HorizontalContentAlignment="Center"
                            Foreground="{StaticResource PhoneForegroundBrush}"
                            />
                            </DataTemplate>
                        </toolkit:LongListSelector.GroupItemTemplate>

                        <toolkit:LongListSelector.GroupFooterTemplate>
                            <DataTemplate>
                                <Grid Height="24"/>
                            </DataTemplate>
                        </toolkit:LongListSelector.GroupFooterTemplate>

                        <toolkit:LongListSelector.GroupHeaderTemplate>
                            <DataTemplate>
                                <Grid 
                                    HorizontalAlignment="Stretch"
                                    Background="{StaticResource PhoneAccentBrush}"
                                    Margin="0,0,0,0"
                                    >

                                    <TextBlock 
                                        Text="{Binding Key}" 
                                        VerticalAlignment="Center"
                                        Margin="12,6,0,6"
                                        Style="{StaticResource PhoneTextLargeStyle}"
                                        />

                                </Grid>
                            </DataTemplate>
                        </toolkit:LongListSelector.GroupHeaderTemplate>

                        <toolkit:LongListSelector.ItemTemplate>
                            <DataTemplate>
                                <Button
                                    toolkit:TiltEffect.IsTiltEnabled="True"
                                    Style="{StaticResource TiltButtonStyle}" 
                                    Click="Button_Click">

                                    <toolkit:ContextMenuService.ContextMenu>
                                        <toolkit:ContextMenu 
                                            Margin="12,0,0,0"
                                            Width="468"
                                            x:Name="contextMenu" 
                                            IsFadeEnabled="False"
                                            IsZoomEnabled="False"
                            
                                            Padding="0" Opened="menu_Opened">
                                            <!-- You can suppress tilt on indivudal menu items with TiltEffect.SuppressTilt="True" -->
                                            <toolkit:MenuItem 
                                                toolkit:TiltEffect.SuppressTilt="True"
                                                Padding="0"
                                                Width="456"
                                                Header="{Binding}"
                                                Margin="0"
                                                >
                                                <toolkit:MenuItem.HeaderTemplate>
                                                    <DataTemplate>
                                                        <Grid Margin="0,0,0,0">
                                                            <Grid.RowDefinitions>
                                                                <RowDefinition Height="Auto"/>
                                                                <RowDefinition Height="Auto"/>
                                                            </Grid.RowDefinitions>
                                                            <Grid.ColumnDefinitions>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="*"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="*"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                                <ColumnDefinition Width="Auto"/>
                                                            </Grid.ColumnDefinitions>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="0"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                Margin="-12,0,0,0"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.DeleteProductItemCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Click="CloseContextMenu"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource deleteBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                HorizontalAlignment="Center"
                                                                Text="delete" 
                                                                Margin="-12,-12,0,0"
                                                                Grid.Row="1" Grid.Column="0"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="3"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Click="EditButon_Click"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource editBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="edit" 
                                                                Margin="0,-12,0,0"
                                                                HorizontalAlignment="Center"
                                                                Grid.Row="1" Grid.Column="3"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="4"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.AddToFavoritesCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Visibility="{Binding IsFavorite,Converter={StaticResource boolToVisibilityInvertor}}"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource addtoFavBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="favorite" 
                                                                Margin="0,-12,0,0"
                                                                HorizontalAlignment="Center"
                                                                Grid.Row="1" Grid.Column="4"
                                                                Visibility="{Binding IsFavorite,Converter={StaticResource boolToVisibilityInvertor}}"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="4"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.RemoveFavoriteCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Visibility="{Binding IsFavorite,Converter={StaticResource boolToVisibilityConverter}}"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource removeFavBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="no fav." 
                                                                Margin="0,-12,0,0"
                                                                HorizontalAlignment="Center"
                                                                Grid.Row="1" Grid.Column="4"
                                                                Visibility="{Binding IsFavorite,Converter={StaticResource boolToVisibilityConverter}}"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button 
                                                                Grid.Row="0" Grid.Column="8"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.DecreaseQuantityCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource minusBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="less" 
                                                                HorizontalAlignment="Center"
                                                                Margin="0,-12,0,0"
                                                                Grid.Row="1" Grid.Column="8"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                            <Button Grid.Row="0" Grid.Column="9"
                                                                toolkit:TiltEffect.IsTiltEnabled="True"
                                                                Height="72"
                                                                Width="72"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Command="{Binding Main.IncreaseQuantityCommand, Source={StaticResource Locator}}"
                                                                CommandParameter="{Binding}"
                                                                Style="{StaticResource PopupIconButton}"
                                                                Content="{StaticResource addBrush}">
                                                            </Button>
                                                            <TextBlock 
                                                                Text="more" 
                                                                Margin="0,-12,0,0"
                                                                HorizontalAlignment="Center"
                                                                Grid.Row="1" Grid.Column="9"
                                                                Foreground="{StaticResource PhoneBackgroundBrush}"
                                                                Style="{StaticResource PhoneTextSmallStyle}"/>

                                                        </Grid>
                                                    </DataTemplate>
                                                </toolkit:MenuItem.HeaderTemplate>
                                            </toolkit:MenuItem>
                                        </toolkit:ContextMenu>
                                    </toolkit:ContextMenuService.ContextMenu>
                                    <Grid 
                                        HorizontalAlignment="Stretch"
                                        Height="75"
                                        >

                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto"/>
                                            <ColumnDefinition Width="*"/>
                                            <ColumnDefinition Width="60"/>
                                            <ColumnDefinition Width="70"/>
                                        </Grid.ColumnDefinitions>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="3"/>
                                            <RowDefinition Height="Auto"/>
                                            <RowDefinition Height="30"/>
                                            <RowDefinition Height="3"/>
                                        </Grid.RowDefinitions>

                                        <Border 
                                            Margin="0,0,0,0"
                                            BorderBrush="{StaticResource PhoneChromeBrush}"
                                            BorderThickness="3"
                                            Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="4"
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Top"/>

                                        <CheckBox 
                                            IsChecked="{Binding IsOnShoppingList,Mode=TwoWay}"
                                            Grid.Row="1" Grid.Column="3" Grid.RowSpan="2"
                                            Margin="12,0,0,0"
                                            VerticalAlignment="Center"
                                            />

                                        <StackPanel
                                            Orientation="Horizontal"
                                            Grid.Row="1" Grid.Column="0">
                                            <TextBlock 
                                                VerticalAlignment="Top"
                                                Text="{Binding Caption}"
                                                TextWrapping="NoWrap"
                                                Margin="12,0,0,0"
                                                Style="{StaticResource PhoneTextLargeStyle}"/>

                                            <Image 
                                                Source="/Images/appbar.favs.rest.png" 
                                                Height="32"
                                                Width="32"
                                                Visibility="{Binding IsFavorite, Converter={StaticResource boolToVisibilityConverter}}"
                                                />
                                        </StackPanel>

                                        <TextBlock 
                                            VerticalAlignment="Top"
                                            Text="{Binding PreferredShop}"
                                            Margin="12,0,0,0"
                                            Grid.Row="2" Grid.Column="0"
                                            TextWrapping="NoWrap"
                                            Style="{StaticResource PhoneTextSubtleStyle}"/>

                                        <TextBlock
                                            Grid.Row="1" Grid.Column="2"
                                            Text="{Binding Quantity}"
                                            VerticalAlignment="Top"
                                            HorizontalAlignment="Left"
                                            TextWrapping="NoWrap"
                                            Margin="0"
                                            Style="{StaticResource PhoneTextLargeStyle}"
                                            />

                                        <TextBlock
                                            Grid.Row="2" Grid.Column="2"
                                            Text="{Binding UnitSize}"
                                            TextWrapping="NoWrap"
                                            VerticalAlignment="Top"
                                            Margin="0"
                                            Style="{StaticResource PhoneTextSubtleStyle}"
                                            />
                                    </Grid>
                                </Button>
                            </DataTemplate>
                        </toolkit:LongListSelector.ItemTemplate>
                    </toolkit:LongListSelector>
                </Grid>
            </controls:PivotItem>
        </controls:Pivot>
        <!--<Button Width="0" Height="0"
                Style="{StaticResource SampleIconButton}"
                Content="{StaticResource addBrush}">
        </Button>
        <Button Width="0" Height="0"
                Style="{StaticResource SampleIconButton}"
                Content="{StaticResource minusBrush}">
        </Button>
        <Button Width="0" Height="0"
                Style="{StaticResource SampleIconButton}"
                Content="{StaticResource addtoFavBrush}">
        </Button>
        <Button Width="0" Height="0"
                Style="{StaticResource SampleIconButton}"
                Content="{StaticResource deleteBrush}">
        </Button>-->
    </Grid>

    <!--Sample code showing usage of ApplicationBar-->
    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton x:Name="addButton" IconUri="/Images/appbar.add.rest.png" Text="add" Click="addButton_Click" />
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="Settings" Click="SettingsMenuItem_Click" />
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>